<!DOCTYPE html>
<html lang="en">

<head>
    <!-- Basic -->
    <meta charset="UTF-8"/>
    <title>模板</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <link href="css/bootstrap.min.css" rel="stylesheet"/>
    <link href="css/style.css" rel="stylesheet"/>
    <link href="css/skycons.css" rel="stylesheet"/>
    <link href="css/font-awesome.min.css" rel="stylesheet"/>
    <link href="css/pace.preloader.css" rel="stylesheet"/>
    <link href="css/jquery.mmenu.css" rel="stylesheet"/>

</head>

<body>
<!--头部开始-->
<div class="navbar" role="navigation">
    <div class="container-fluid container-nav">
        <!-- 顶部小图标 -->
        <ul class="nav navbar-nav navbar-actions navbar-left">
            <li><a href="#" id="main-menu-toggle"><i class="fa fa-th-large" style="color: #ed9c28"></i></a></li>
            <li class="visible-xs visible-sm"><a href="#" id="sidebar-menu"><i class="fa fa-navicon"></i></a></li>
        </ul>

        <!-- 头部右边-->
        <div class="navbar-right">
            <!-- 三个小图标 -->
            <ul class="notifications hidden-xs">
                <li>
                    <a href="#" class="dropdown-toggle notification-icon" data-toggle="dropdown">
                        <i class="fa fa-tasks"></i>
                    </a>
                </li>
                <li>
                    <a href="#" class="dropdown-toggle notification-icon" data-toggle="dropdown">
                        <i class="fa fa-envelope"></i>
                    </a>
                </li>
                <li>
                    <a href="#" class="dropdown-toggle notification-icon" data-toggle="dropdown">
                        <i class="fa fa-bell"></i>
                    </a>
                </li>
            </ul>

            <!-- 用户名 -->
            <div class="userbox">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    <div class="profile-info">
                        <span class="name">Tiffany</span>
                        <span class="role"><i class="fa fa-circle bk-fg-success"></i> 管理员</span>
                    </div>
                    <i class="fa custom-caret"></i>
                </a>
                <!--下拉-->
                <div class="dropdown-menu">
                    <ul class="list-unstyled">
                        <li class="dropdown-menu-header bk-bg-white bk-margin-top-15">
                        </li>
                        <li><a href="new2.html"><i class="fa fa-wrench"></i>设置</a></li>
                        <li><a href="login.html"><i class="fa fa-power-off"></i> 注销</a></li>
                    </ul>
                </div>
            </div>

        </div>

    </div>
</div>


<!-- 导航 -->
<div class="container-fluid content">
    <div class="row">
        <!-- Sidebar -->
        <div class="sidebar">
            <div class="sidebar-collapse">
                <!-- Logo-->
                <div class="sidebar-header">
                    <img src="img/logo1.png" class="img-responsive" alt=""/>
                </div>
                <!-- 侧导航-->
                <div class="sidebar-menu">
                    <nav id="menu" class="nav-main" role="navigation">
                        <ul class="nav nav-sidebar">
                            <div class="panel-body text-center">
                                <a href="index.html">
                                    <i class="fa fa-home" aria-hidden="true"></i><span>主页</span>
                                </a>
                            </div>

                            <li class="nav-parent in">
                                <a>
                                    <i class="fa fa-copy" aria-hidden="true"></i><span>one</span>
                                </a>
                                <ul class="nav nav-children">
                                    <li><a href="new.html"><span class="text"> 修改信息</span></a></li>
                                    <li><a href="new2.html"><span class="text"> 2</span></a></li>
                                    <li><a href="#"><span class="text"> 3</span></a></li>
                                </ul>
                            </li>
                            <li class="nav-parent">
                                <a>
                                    <i class="fa fa-tasks" aria-hidden="true"></i><span>two</span>
                                </a>
                                <ul class="nav nav-children">
                                    <li><a href="#"><span class="text"> 1</span></a></li>
                                    <li><a href="#"><span class="text"> 2</span></a></li>
                                    <li><a href="#"><span class="text"> 3</span></a></li>
                                </ul>
                            </li>
                            <li class="nav-parent">
                                <a>
                                    <i class="fa fa-list-alt" aria-hidden="true"></i><span>three</span>
                                </a>
                                <ul class="nav nav-children">
                                    <li><a href="#"><span class="text"> 1</span></a></li>
                                    <li><a href="#"><span class="text"> 2</span></a></li>
                                    <li><a href="#"><span class="text"> 3</span></a></li>
                                </ul>
                            </li>
                            <li class="nav-parent">
                                <a>
                                    <i class="fa fa-table" aria-hidden="true"></i><span>four</span>
                                </a>
                                <ul class="nav nav-children">
                                    <li><a href="#"><span class="text"> 1</span></a></li>
                                    <li><a href="#"><span class="text"> 2</span></a></li>
                                    <li><a href="#"><span class="text"> 3</span></a></li>

                                </ul>
                            </li>
                            <li class="nav-parent">
                                <a>
                                    <i class="fa fa-random" aria-hidden="true"></i><span>five</span>
                                </a>
                                <ul class="nav nav-children">
                                    <li><a href="#"><span class="text"> 哈哈</span></a></li>
                                    <li><a href="#"><span class="text"> 哈哈</span></a></li>
                                    <li><a href="#"><span class="text"> 哈哈</span></a></li>
                                </ul>
                            </li>
                        </ul>
                    </nav>
                </div>
                <!-- 导航结束-->
            </div>
            <div class="sidebar-footer"></div>
        </div>
        <div class="clearfix"></div>
    </div>
</div>

<!--内容页-->
<div class="main">

    <!--内容页头部-->
    <div class="page-header">
        <div class="pull-left">
            <ol class="breadcrumb visible-sm visible-md visible-lg">
                <li><a href="index.html"><i class="icon fa fa-home"></i>主页</a></li>
                <li class="active"><i class="fa fa-pencil"></i>模板</li>
            </ol>
        </div>
        <div class="pull-right">
            <h2>主页</h2>
        </div>
    </div>

    <div class="mould">
        <form action="" class="mould_form">
            <h4 class="mould_h4">模板</h4>
            <div class="mould_all col-md-12">
                <div class="form-group col-md-4">
                    <span class="new_name">模板名 ： </span>
                    <input type="text" autocomplete="off">
                </div>
                <div class="form-group col-md-4">
                    <span class="new_name">申请人 ： </span>
                    <input type="text" autocomplete="off">
                </div>
                <div class="form-group col-md-4">
                    <span class="new_name">申请时间 ： </span>
                    <input type="text" class="sang_Calender" autocomplete="off">
                </div>
                <hr style="width: 100%">

                <div class="mould_icon">
                    <a href="#" class="mould_a1" onclick='addElement()'><span class="fa fa-plus"></span></a>&emsp;
                    <a href="#" class="mould_a2" onclick='dropElement()'><span class="fa fa-minus"></span></a>
                </div>
                <div id="course" class="col-md-12">
                </div>
                <div class="templet_icon2">
                    <a href="#" class="templet_a1" onclick='addElement2()'><span class="fa fa-plus"></span></a>&emsp;
                    <a href="#" class="templet_a2" onclick='dropElement2()'><span class="fa fa-minus"></span></a>
                </div>
                <div id="course2" class="col-md-12">
                </div>
            </div>
        </form>

    </div>


</div>


<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/core.min.js"></script>
<script src="js/jquery.mmenu.min.js"></script>
<script type="text/javascript" src="js/datetime.js"></script>
<script>
    var i = 1;
    function addElement() {
        var div = document.createElement('div');
        div.innerHTML = '<div class="form-group col-md-4" id="course"> ' +
            '<span class="new_name">原由 ： </span> ' +
            '<input type="text" class="new_in" autocomplete="off"> ' +
            '</div>';
        div.id = 'Elem' + i;
        document.getElementById('course').appendChild(div);
        i++;
    }
    function dropElement() {
        var aaa = document.getElementById('Elem' + (i - 1));
        document.getElementById('course').removeChild(aaa);
        i--;
    }
</script>
<script>
    var i = 1;
    function addElement2() {
        var div = document.createElement('div');
        div.innerHTML = '<div class="form-group col-md-4"> <select style="width:85%;border: 1px solid #cccccc"> <option value=""></option> <option value="">1</option> <option value="">2</option> <option value="">3</option> </select> </div>';
        div.id = 'Elem2' + i;
        document.getElementById('course2').appendChild(div);
        i++;
    }
    function dropElement2() {
        var bbb = document.getElementById('Elem2' + (i - 1));
        document.getElementById('course2').removeChild(bbb);
        i--;
    }
</script>

</body>
</html>